<div id="content">

  <p id="btn" (click)="close()">
    <!-- <i nz-icon nzType="left" nzTheme="outline"></i> -->
    <ion-icon name="arrow-back"></ion-icon>
    个人中心
  </p>


  <div class="content-step">
    <Steps [size]="'small'" [current]="current" [direction]="'horizontal'">
      <Step [title]="'验证当前密码'" [status]="'finish'" [icon]="customIcon"></Step>
      <Step [title]="'修改密码'" [status]="current>=1?'finish':''" [icon]="customIcon1"></Step>
      <Step [title]="'完成'" [icon]="customIcon2"></Step>
    </Steps>
  </div>

  <ng-template #customIcon>
    <div class="content-customIcon"
      [ngStyle]="{'background-color':current>=0?'#0987fe':'#fff','color': current>=0?'#fff':'#ccc'}">
      1
    </div>
  </ng-template>
  <ng-template #customIcon1>
    <div class="content-customIcon"
      [ngStyle]="{'background-color':current>=1?'#0987fe':'#fff','color': current>=1?'#fff':'#ccc'}">
      2
    </div>
  </ng-template>
  <ng-template #customIcon2>
    <div class="content-customIcon"
      [ngStyle]="{'background-color':current>=2?'#0987fe':'#fff','color': current>=2?'#fff':'#ccc'}">
      3
    </div>
  </ng-template>

  <div class="content-step-content" *ngIf="current === 0">
    <div class="am-list-body">
      <InputItem name="oldpwd" [type]="'password'" [placeholder]="'请输入当前用户登录密码'" [(ngModel)]="oldpwd" [clear]="'true'">
        当前用户登录密码</InputItem>
    </div>
    <WhiteSpace size='md'></WhiteSpace>
    <div class="content-step-content-btn" Button [type]="'primary'" [size]="'small'" (click)="authyKey()"
      [loading]="btnloading">下一步</div>
  </div>
  <div class="content-step-content" *ngIf="current === 1">
    <div class="am-list-body">
      <InputItem name="newpwd" [type]="'password'" [placeholder]="'请输入6~16位长度密码'" [maxLength]="16" [error]="!pwdLength" (onErrorClick)="displayErrMsg('请输入6~16位长度密码!')" (onChange)="this.pwdLength = 'true'" [(ngModel)]="newpwd" [clear]="'true'">
        新密码
      </InputItem>
      <InputItem name="confirm" [type]="'password'" [placeholder]="'请再次输入密码确认'" [maxLength]="16" [error]="!confirmOK" (onErrorClick)="displayErrMsg('两次密码不相同，请重新输入!')" (onChange)="this.confirmOK = 'true'" [(ngModel)]="confirm" [clear]="'true'">
        再次输入
      </InputItem>
    </div>
    <WhiteSpace size='md'></WhiteSpace>
    <div class="content-step-content-btn" Button [type]="'primary'" [size]="'small'" (click)="ensure()">下一步</div>
  </div>
  <div class="content-step-content" *ngIf="current === 2">
    <div class="am-list-body">
      <Result [img]="img2" [title]="'修改成功'">
        <ng-template #img2>
          <Icon class="spe" [type]="'check-circle'" [color]="'#1F90E6'"></Icon>
        </ng-template>
      </Result>
      <div class="content-step-content-btn" Button [type]="'primary'" [size]="'small'" (click)="logout()">重新登录 ( {{countdown}} )</div>
    </div>
  </div>

</div>